<template>
  <div>
    <!-- 面包屑导航 -->
    <breadcrumb-nav>
      <template v-slot:firstMenu>身份认证</template>
      <template v-slot:secondMenu>角色列表</template>
    </breadcrumb-nav>

    <!-- 卡片视图 -->
    <el-card>

      <!-- 角色表格 -->
      <role-table :roles-list="rolesList" @role-list="updateRoleList" />
    </el-card>
  </div>
</template>

<script>

  // 导入公共组件
  import BreadcrumbNav from "../common/BreadcrumbNav";

  // 导入子组件
  import RoleTable from "./ChildComponents/RoleTable";

  // 导入发送网络请求的函数
  import {getFarmerPageRequest} from "network/rights";

  export default {
    name: "Roles",
    components:{
      BreadcrumbNav,
      RoleTable
    },
    data() {
      return {
        rolesList: [],
      }
    },
    created() {
      this.getRightsList();
    },
    methods: {
      // 获取角色列表
      getRightsList() {
        getFarmerPageRequest(this.type,this.pagenum,this.pagesize).then(({code,data,msg}) => {
          if (code !== 200) return this.$errorMessage(msg);
          this.rightsList = data;
        })
      },
      // 监听子组件中发出的事件，重新获取角色列表
      updateRoleList(){
        this.getRightsList();
      }
    }
  }
</script>

<style scoped>

</style>
